<script setup>
import { ref, computed } from 'vue';
 
const dialogVisible = ref(false);
const bidding = ref(false);
const tenderer = ref(false);

const handleCommand = (command) => {
if (command === 'c') {
  // 根据需要打开登录对话框
  dialogVisible.value = true;
}
if(command === 'a'){
  bidding.value=true;
}
if(command === 'b'){
  tenderer.value=true
}
};
// 所有表格数据
const tableData = ref([
  
]);

import { allTendererInfo } from '@/api/tendererInfo.js';

const allInfo=async()=>{
  let result=await allTendererInfo()
  tableData.value=result.data
}

allInfo();

// 分页状态
const currentPage = ref(1); // 当前页
const pageSize = ref(10);    // 每页显示的数据量

// 计算当前页展示的数据
const currentPageData = computed(() => {
  const start = (currentPage.value - 1) * pageSize.value;
  const end = start + pageSize.value;
  return tableData.value.slice(start, end);
});

// 分页切换处理
const handlePageChange = (page) => {
  currentPage.value = page;
};
</script>
<template>
    <div>
      <el-main class="main-content">
        <el-table :data="currentPageData" style="width: 100%">
          <el-table-column label="招标编号" prop="tenderProjectNo"></el-table-column>
          <el-table-column label="项目状态" prop="state"></el-table-column>
          <el-table-column label="药品名称" prop="drugName"></el-table-column>
          <el-table-column label="制药单位" prop="manufacturer"></el-table-column>
          <el-table-column label="截止日期" prop="tenderDeadline"></el-table-column>
        </el-table>
        
        <!-- 分页组件 -->
        <el-pagination 
          background 
          layout="prev, pager, next" 
          :total="tableData.length" 
          :current-page="currentPage" 
          :page-size="pageSize" 
          @current-change="handlePageChange" />
      </el-main>
    </div>
  </template>
  
  <style scoped>
  
  /* 表格内容 */
  .main-content {
  padding: 20px;
  padding-bottom: 50px; /* 为了给底部版权留出空间 */
}
  </style>